﻿@model EntityPickerModel

@{
    async Task HighlightSearchTermInTitle(EntityPickerModel.SearchResultModel item)
    {
        if (Model.HighlightSearchTerm && Model.SearchTerm.HasValue() && item.Title.HasValue())
        {
            @Html.Raw(item.Title.Replace(Model.SearchTerm, $"<span class='highlight'>{Model.SearchTerm}</span>", StringComparison.OrdinalIgnoreCase))
        }
        else
        {
            @item.Title
        }
    }
}

@foreach (var item in Model.SearchResult ?? Enumerable.Empty<EntityPickerModel.SearchResultModel>())
{
    <div class="col-xl-3 col-lg-4 col-sm-6">
        <div class="row flex-nowrap sm-gutters py-2 my-1 entpicker-item@(item.Disable ? " disabled" : "")" 
             attr-class='(item.Selected, "selected")' 
             data-id="@item.Id" 
             data-returnvalue="@item.ReturnValue">

            <div sm-if="item.ImageUrl.HasValue()" class="col-auto">
                <div class="entpicker-thumb">
                    <div class="img-center-container">
                        <img src="@item.ImageUrl" alt="" />
                    </div>
                </div>
            </div>
            <div class="col text-truncate">
                <div class="entpicker-data text-truncate">
                    <div class="title text-truncate" title="@item.Title">
                        @if (item.LabelText.HasValue())
                        {
                            <span class="badge @item.LabelClassName">@item.LabelText</span>
                        }
                        <span>@{ await HighlightSearchTermInTitle(item); }</span>
                    </div>
                    <div class="text-truncate">
                        @if (item.Published.HasValue)
                        {
                            <i class="published @(item.Published.Value ? "fa fa-globe" : "far fa-eye-slash")" title="@T(item.Published.Value ? "Common.Published" : "Common.Unpublished")"></i>
                        }
                        <span class="summary" title="@item.SummaryTitle">@item.Summary</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
}

<div class="col-12 py-2 text-center entpicker-list-footer">
    @if (Model.SearchResult == null || Model.SearchResult.Count == 0)
    {
        <span class="text-muted">@T("Common.EntityPicker.NoMoreItemsFound")</span>
    }
    else if (Model.SearchResult.Count == Model.PageSize)
    {
        <span class="load-more">&nbsp;</span>
    }
    else if (Model.PageIndex > 0)
    {
        <span class="text-muted">@T("Common.EntityPicker.NoMoreItemsFound")</span>
    }
</div>